<template>
  <el-row :gutter="20">
    <el-col :span="12" v-if="customer_info">
      <div class="item">
        <img v-vImg="customer_info.image" alt="">
        <div class="info">
          <h1 v-text="customer_info.name"></h1>
          <span v-text="customer_info.company"></span>
          <span v-text="order.is_company ? '销售' : '个人'"></span>
          <span v-text="customer_info.tel"></span>
        </div>
      </div>
    </el-col>
    <el-col :span="12" v-if="customer_service_info && customer_service_info.name">
      <div class="item">
        <img v-vImg="customer_service_info.image" alt="">
        <div class="info">
          <h1 v-text="customer_service_info.name"></h1>
          <span>服务商</span>
          <span>测量</span>
          <span v-text="customer_service_info.tel"></span>
        </div>
      </div>
    </el-col>

    <el-col :span="12" v-if="service_info && service_info.name">
      <div class="item">
        <img v-vImg="service_info.image" alt="">
        <div class="info">
          <h1 v-text="service_info.name"></h1>
          <span>服务商</span>
          <span>安装</span>
          <span v-text="service_info.tel"></span>
        </div>
      </div>
    </el-col>
  </el-row>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters('orders', [
      'order',
      'customer_info',
      'customer_service_info',
      'service_info'
    ])
  }
}
</script>